import { DotLoading } from 'antd-mobile';
import React from 'react'
import { Switch, Route, Redirect } from "react-router-dom";
// import "./assets/css/reset.css"
// import Register from "./pages/Register/Register"
// import Index from "./pages/Index/Index"
// import Home from "./pages/Home/Home"
// import Detail from "./pages/Detail/Detail"
// import Order from "./pages/Order/Order"
const Login = React.lazy(() => import("./pages/Login/Login"))
const Register = React.lazy(() => import("./pages/Register/Register"))
const Index = React.lazy(() => import("./pages/Index/Index"))
const Home = React.lazy(() => import("./pages/Home/Home"))
const Detail = React.lazy(() => import("./pages/Detail/Detail"))
const Order = React.lazy(() => import("./pages/Order/Order"))
const Coupon = React.lazy(() => import("./pages/Coupon/Coupon"))

const App = () => {
  return (
    <div className='app'>
      <React.Suspense fallback={<DotLoading color='primary' />}>
        <Switch>
          <Route path="/login" component={Login} />
          <Route path="/register" component={Register} />
          <Route path="/index" component={Index} />
          <Route path="/home" component={Home} />
          <Route path="/detail/:id" component={Detail} />
          <Route path="/order" component={Order} />
          <Route path="/coupon" component={Coupon} />
          <Redirect to="/login" />
        </Switch>
      </React.Suspense>
    </div>
  )
}

export default App